import React from 'react'
import { Table } from 'antd'
import { ColumnProps } from 'antd/lib/table'
import { formatTime } from '~/utils/utils'

const colums: any = (): ColumnProps<any>[] => [
  {
    title: '序号',
    dataIndex: 'id',
    align: 'center',
    render: (_: any, record: any, index: number) => <div>{index + 1}</div>
  },
  {
    title: '凭证名称',
    dataIndex: 'voucherName',
    align: 'center'
  },
  {
    title: '制作时间',
    dataIndex: 'applyTime',
    align: 'center',
    render: (applyTime: any) => applyTime && formatTime(applyTime)
  },
  {
    title: '作废人',
    dataIndex: 'discardUserName',
    align: 'center'
  },
  {
    title: '作废时间',
    dataIndex: 'discardTime',
    align: 'center',
    render: (discardTime: any) => discardTime && formatTime(discardTime)
  },
  {
    title: '作废原因',
    align: 'center',
    dataIndex: 'discardReason',
    key: 'discardReason'
  }
]

const WaitingList = ({ moveListItems }: any) => {
  return (
    <div>
      <Table
        pagination={{
          size: 'default',
          total: moveListItems ? moveListItems.length : 0,
          showSizeChanger: true,
          showQuickJumper: true,
          showTotal: total => `共 ${total} 条`
        }}
        bordered
        rowKey="id"
        dataSource={moveListItems}
        columns={colums()}
      />
    </div>
  )
}

export default WaitingList
